<template>
  <card title="待办任务">
    <template v-slot:headerOpt>
      <div class="more-btn" @click="showMore">更多<i class="el-icon-d-arrow-right" /></div>
    </template>
    <div class="to-do-list">
      <div v-for="(item,m) in todolist" :key="'todolist_'+m" class="to-do-item" @click="viewDetail(item)">
        <span class="content">
          <template v-if="item.auditType == 1">
            <el-tag type="success">待审核</el-tag>
          </template>
          <template v-else-if="item.auditType == 3">
            <el-tag type="danger">已驳回</el-tag>
          </template>
          <template v-else>
            <el-tag type="danger">未知</el-tag>
          </template>
          【{{ item.menu }}】{{ item.title }}
        </span>
        <span class="time">{{ item.createTime | date }}</span>
      </div>
    </div>
    <!-- 待办事项详情弹窗 需要将api和参数都传过去 -->
    <process-detail :current-row="currentRow" :show-modal.sync="showTaskInfoModal" @freshList="getToDoList" />
  </card>
</template>

<script>
import card from '../card.vue'
import { getUpcomingWorkflowTasks } from '@/api/flow'
export default {
  name: 'Tasks',
  components: {
    card
  },
  data() {
    return {
      todolist: [],
      currentRow: {},
      showTaskInfoModal: false
    }
  },
  mounted() {
    this.getToDoList()
  },
  methods: {
    getToDoList() {
      getUpcomingWorkflowTasks().then(res => {
        if (res && res.code === '0001') {
          this.todolist = res.data
        }
      })
    },
    showMore() {
      this.$emit('showMore', '1')
    },
    viewDetail(data) {
      this.currentRow = data
      this.showTaskInfoModal = true
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
